<?php
	require_once "weixin_info.php";//å¾®ä¿¡æŽˆæƒèŽ·å–ç”¨æˆ·å¤´åƒç­‰ä¿¡æ?
	session_start();

	require_once "config.php";

    $sql="select * from dyspw_goods ORDER BY time ";
	if(isset($_GET['key']) && mb_strlen(trim($_GET['key']))){
	    $sql="select * from dyspw_goods where title like '%".trim($_GET['key'])."%' ORDER BY time ";
    }
	$goods_sql = $mysql->query($sql);
	$goods_list = $goods_sql->fetch_all(MYSQLI_ASSOC);

	require_once "jssdk.php";
	$jssdk = new JSSDK();
	$signPackage = $jssdk->GetSignPackage();
 ?>

<!DOCTYPE html>

<html>



<head>

	<meta charset="utf-8">

	<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />

	<title>商城</title>

	<script src="js/mui.min.js"></script>
	<script src="js/dsbridge.js" type="text/javascript"></script>

	<link href="css/mui.min.css" rel="stylesheet" />

	<link href="css/index.css" rel="stylesheet" />

	<link rel="stylesheet" href="css/core.css">
	<script src="js/app-login.js" type="text/javascript"></script>
	<style>
		.cardList img{
			max-width: 100%;
			height: 250px;
		}

		.search{
			display: flex;
    		align-items: center;
			line-height: 0;
		}

		.search .mui-input-clear{
			line-height: 0;
    		height: 34px;
		}
	</style>

	<script type="text/javascript" charset="utf-8">

		mui.init();

	</script>

<script>
var _hmt = _hmt || [];
(function() {
  var hm = document.createElement("script");
  hm.src = "https://hm.baidu.com/hm.js?cb5d49b07e0a753dc8ee27ba2c73495d";
  var s = document.getElementsByTagName("script")[0];
  s.parentNode.insertBefore(hm, s);
})();
</script>
</head>



<body>

	<div class="container" style="margin-bottom: 40px;">

		<div class="top">

			<div class="header mui-row">

				<div class="left mui-col-xs-6">

					<span class="mui-icon mui-icon-arrowleft" onclick="goindex()"></span>

					<img src="./images/logo.gif" alt="">

					<span class="title">生活</span>

				</div>

				<div class="location mui-col-xs-6" onclick="getLo();">

					<img src="./images/loc .gif" alt="">

					<div class="address mui-ellipsis">苏州中心商场C座</div>

					<span class="mui-icon mui-icon-arrowright"></span>

				</div>

			</div>

			<!-- 搜索栏 -->

			<div class="search mui-row">

				<div class="mui-col-xs-10" style="width: 100%">

					<div class="mui-input-row mui-search">

						<input type="search" placeholder="<?php
                            if(isset($_GET['key']) && mb_strlen(trim($_GET['key']))){
                                echo trim($_GET['key']);
                            }else{
                                echo '搜索你想要的内容';
                            }
                        ?>" class="mui-input-clear shopSearch">
					</div>
				</div>

<!--				<div class="mui-col-xs-2 scanBtn">-->
<!---->
<!--					<div class="mui-row  mui-text-center">-->
<!---->
<!--						<div class="mui-col-xs-12 scanImg" onclick="toScan();">-->
<!---->
<!--							<image src="./images/scan.gif" class="scanIcon" />-->
<!---->
<!--						</div>-->
<!---->
<!--						<div class="mui-col-sm-12 text">扫一扫</div>-->
<!---->
<!--					</div>-->
<!---->
<!--				</div>-->

			</div>

			<!-- 轮播 -->

			<div class="mui-slider poster">

				<div class="mui-slider-group">

					<!--支持循环，需要重复图片节点-->

					<!-- <div class="mui-slider-item mui-slider-item-duplicate"><a href="#"><img

								src="./images/9965de69c69b70d0dab1bb65cd5dc62e.jpg" /></a></div> -->

					<!-- <div class="mui-slider-item"><a href="#"><img src="./images/banner1.jpg" /></a></div> -->

					<!-- <div class="mui-slider-item"><a href="#"><img src="./images/9965de69c69b70d0dab1bb65cd5dc62e.jpg" /></a></div>

					<div class="mui-slider-item"><a href="#"><img src="./images/9965de69c69b70d0dab1bb65cd5dc62e.jpg" /></a></div>

					<div class="mui-slider-item"><a href="#"><img src="./images/9965de69c69b70d0dab1bb65cd5dc62e.jpg" /></a></div> -->

					<!--支持循环，需要重复图片节点-->

					<div class="mui-slider-item mui-slider-item-duplicate"><a href="#"><img src="./images/banner1.jpg" /></a>

					</div>

				</div>

			</div>

		</div>



		<!-- 栏目column -->

		<div class="columns mui-row">

				<div class="mui-col-xs-2 mui-text-center">
					<a href="shop_list.php?sort=92">
					<div class="columnLogo">
						<img src="./images/wm.jpg" alt="" class="img">
					</div>
					<div class="columnTitle">外卖</div>
					</a>
				</div>


			<div class="mui-col-xs-2 mui-text-center">
				<a href="shop_list.php?sort=10">
				<div class="columnLogo">
					<img src="./images/ms.jpg" alt="" class="img">
				</div>
				<div class="columnTitle">美食</div>
				</a>
			</div>

			<div class="mui-col-xs-2 mui-text-center">
				<a href="shop_list.php?sort=16">
				<div class="columnLogo">
					<img src="./images/jy.jpg" alt="" class="img">
				</div>
				<div class="columnTitle">教育</div>
				</a>
			</div>

			<div class="mui-col-xs-2 mui-text-center">
				<a href="shop_list.php?sort=12">
				<div class="columnLogo">

					<img src="./images/yl.jpg" alt="" class="img">

				</div>

				<div class="columnTitle">娱乐</div>
				</a>
			</div>

			<div class="mui-col-xs-2 mui-text-center">
				<a href="shop_list.php?sort=89">
				<div class="columnLogo">

					<img src="./images/jc.jpg" alt="" class="img">

				</div>

				<div class="columnTitle">建材</div>
				</a>
			</div>

			<div class="mui-col-xs-2 mui-text-center">
				<a href="shop_list.php?sort=17">
				<div class="columnLogo">

					<img src="./images/js.jpg" alt="" class="img">

				</div>

				<div class="columnTitle">健身</div>
				</a>
			</div>

		</div>



		<!-- 产品列表 -->

		<div class="dataList">

			<div class="cardList">

                <?php if($goods_list){ foreach ($goods_list as $key => $val) {?>
                    <div class="mui-card cardItem">

                        <a href="goods_info.php?id=<?php echo $val['id']; ?>">

                            <div class="mui-card-content" style="background:url('<?php echo $val['img'] ?>')no-repeat center;background-size: cover;width: 100%;height: 130px;">

                                <!-- <img src="<?php echo $val['img'] ?>" alt="" class="itemImg"> -->

                            </div>

                            <div class="mui-card-footer mui-row">

                                <div class="title mui-ellipsis mui-col-xs-12"><?php echo $val['title'] ?></div>

                                <div class="desc mui-ellipsis mui-col-xs-12"><?php echo $val['details'] ?></div>

                                <div class="data mui-col-xs-12">

                                    <div class="price"><span class="num" style="    font-size: 13px;">团购价:¥<?php echo $val['group_money'] ?><em style="    text-decoration: line-through;font-size: 11px;color: #999;    margin-left: 10px;">原价:￥<?php echo $val['money'] ?></em></span></div>

                                    <div class="salseNum">总量：<?php echo $val['stock'] ?> &nbsp;已售：<?php echo $val['sales']
                                        ?></div>

                                </div>

                            </div>
                        </a>

                    </div>
                <?php }}else{ ?>
                    <p style="text-align: center;margin-top: 25px;letter-spacing: 1px">未找到相关产品<br><a style="color: red;
                    margin-top: 8px;display: block" href="/shopping.php">在去逛逛</a></p>
                <?php } ?>

				<!-- <div class="mui-card cardItem">

					<div class="mui-card-content">

						<img src="./images/pd2.jpg" alt="" class="itemImg">

					</div>

					<div class="mui-card-footer mui-row">

						<div class="title mui-ellipsis mui-col-xs-12">美食名称-白色爱琴海</div>

						<div class="desc mui-ellipsis mui-col-xs-12">欧式风格:浪漫艺术与生活品质的追求</div>

						<div class="data mui-col-xs-12">

							<div class="price">¥<span class="num">999</span>/平</div>

							<div class="salseNum">已售3份</div>

						</div>

					</div>

				</div>



				<div class="mui-card cardItem">

					<div class="mui-card-content">

						<img src="./images/pd2.jpg" alt="" class="itemImg">

					</div>

					<div class="mui-card-footer mui-row">

						<div class="title mui-ellipsis mui-col-xs-12">美食名称-白色爱琴海</div>

						<div class="desc mui-ellipsis mui-col-xs-12">欧式风格:浪漫艺术与生活品质的追求</div>

						<div class="data mui-col-xs-12">

							<div class="price">¥<span class="num">999</span>/平</div>

							<div class="salseNum">已售3份</div>

						</div>

					</div>

				</div> -->

			</div>

		</div>

	</div>

	<footer>

	    <ul class="cl">

	        <li><a href="index.php">首页</a></li>

	        <li><a href="fenlei.php">分类</a></li>

	        <li>

	            <a href="baishe.php" class="btn-baise">拍</a>

	        </li>

	        <li><a href="shopping.php">商城</a></li>

	        <li><a href="member.php">我</a></li>

	    </ul>

	</footer>



	<!-- 模板引擎 -->

	<!-- <script type="text/html" id="tpl">

		{{ each items v i }}

		<div class="mui-card">

			<div class="mui-card-content">

				<img src="{{ v }}" alt="" class="itemImg">

			</div>

			<div class="mui-card-footer mui-row">

				<div class="title mui-ellipsis mui-col-xs-12">强化地板-白色爱琴海</div>

				<div class="desc mui-ellipsis mui-col-xs-12">欧式风格:浪漫艺术与生活品质的追求</div>

				<div class="data mui-col-xs-12">

					<div class="price">¥<span class="num">999</span>/平</div>

					<div class="salseNum">已售2份</div>

				</div>

			</div>

		</div>

		{{ /each }}

	</script> -->

	<script src="js/jquery-2.2.4.min.js"></script>

	<script src="js/jquery.waterfall.js"></script>

	<script src="js/template-web.js"></script>
	<script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>

	<script>

		$(function () {

            //商城首页搜索
            $(".shopSearch").focus(function(){
                $(document).keyup(function(event){
                    if(event.keyCode ==13){
                        var key = $('.shopSearch').val();
                        window.location.href='/xiaochengxu/shopping.php?key='+key
                    }
                });
            });


			render();

			wx.config({
				debug: false,
				appId: '<?php echo $signPackage["appId"];?>' ,
				timestamp: <?php echo $signPackage["timestamp"];?>,
				nonceStr: '<?php echo $signPackage["nonceStr"];?>',
				signature: '<?php echo $signPackage["signature"];?>',
				jsApiList: [
					'previewImage', 'openLocation', 'getLocation',
					'checkJsApi',
					'scanQRCode',
				]
			});
			wx.error(function(res) {
				alert("出错了：" + res.errMsg); //这个地方的好处就是wx.config配置错误，会弹出窗口哪里错误，然后根据微信文档查询即可。
			});


			function render() {

				// var dataList = ["./images/9965de69c69b70d0dab1bb65cd5dc62e.jpg",

				// 	"./images/9965de69c69b70d0dab1bb65cd5dc62e.jpg",

				// 	"./images/9965de69c69b70d0dab1bb65cd5dc62e.jpg", "./images/9965de69c69b70d0dab1bb65cd5dc62e.jpg",

				// 	"./images/9965de69c69b70d0dab1bb65cd5dc62e.jpg", "./images/9965de69c69b70d0dab1bb65cd5dc62e.jpg",

				// 	"./images/9965de69c69b70d0dab1bb65cd5dc62e.jpg", "./images/9965de69c69b70d0dab1bb65cd5dc62e.jpg",

				// ]

				// var htmlStr = template("tpl", dataList);

				// $('.cardList').append(htmlStr);

				$('.cardList').waterFall();



				// var gallery = mui('.mui-slider');

				// gallery.slider({

				// 	interval: 1000 //自动轮播周期，若为0则不自动播放，默认为0；

				// });

			}

		})

	function goindex(){
		window.location.href='https://5p8.fyh5p8.com/xiaochengxu/index.php';
	}

	function toScan(){
		if(window.navigator.userAgent == 'AndroidNative'){
			// javascript:android.scanQRCode();
		} else if (window.navigator.userAgent == 'IosNative') {
			// window.webkit.messageHandlers.scanQRCode.postMessage({});
		} else {
			wx.ready(function() {
				wx.checkJsApi({
					jsApiList: ['scanQRCode'],
					success: function(res) {
						console.log('扫一扫：',res)
					}
				});

				wx.scanQRCode({
					needResult: 1, // 默认为0，扫描结果由微信处理，1则直接返回扫描结果，
					scanType: ["qrCode", "barCode"], // 可以指定扫二维码还是一维码，默认二者都有
					success: function(res) {
						var result = res.resultStr; // 当needResult 为 1 时，扫码返回的结果
						// alert(result)
						// $.ajax({
						//     url: result,
						//     dataType: 'json',
						//     type:'get',
						//     data:{"shop_id":_shopid},
						//     success:function(res){
						//         layer.open({content: res.msg,skin: 'msg',time: 3 });
						//     },
						//     error:function(){
						//         //请求出错处理
						//     }
						// })
					},
					error: function(res) {
						alert(res)
					}
				});
			});
		}
    }

	function getLo(){
		if(window.navigator.userAgent == 'AndroidNative'){
			dsBridge.call("mapSiteSelf", 'mapSiteSelf');
			// javascript:android.mapSite();
		} else if (window.navigator.userAgent == 'IosNative') {
			// window.webkit.messageHandlers.mapSite.postMessage({});
			dsBridge.call("mapSiteSelf", 'mapSiteSelf');
		} else {
			wx.ready(function () {
				wx.getLocation({
					type: 'gcj02', // 默认为wgs84的gps坐标，如果要返回直接给openLocation用的火星坐标，可传入'gcj02'
					success: function (res) {
						//使用微信内置地图查看位置接口
						wx.openLocation({
							latitude : res.latitude, // 纬度，浮点数，范围为90 ~ -90
							longitude : res.longitude, // 经度，浮点数，范围为180 ~ -180。
							name : '我的位置', // 位置名
							//address : '5pai8社区', // 地址详情说明
							scale : 28, // 地图缩放级别,整形值,范围从1~28。默认为最大
							//infoUrl : 'http://www.gongjuji.net' // 在查看位置界面底部显示的超链接,可点击跳转（测试好像不可用）
						});

					},
					cancel: function (res) {
						layer.open({
							content: '您拒绝授权获取地理位置',
							btn: '我知道了'
						});

					},
					fail: function (res) {
						// alert('fail'+JSON.stringify(res));
						layer.open({
							content: '未能获取地理位置，首先检查手机是否启用微信定位',
							btn: '我知道了'
						});
					}
				});
				wx.error(function (res) {
					layer.open({
						content: 'error接口调取失败！请联系技术部' + JSON.stringify(
							res),
						btn: '我知道了'
					});
				});
			});
		}
		// wx.ready(function () {
		// 	wx.getLocation({
		// 		type: 'gcj02', // 默认为wgs84的gps坐标，如果要返回直接给openLocation用的火星坐标，可传入'gcj02'
		// 		success: function (res) {
		// 			//使用微信内置地图查看位置接口
		// 			wx.openLocation({
		// 				latitude : res.latitude, // 纬度，浮点数，范围为90 ~ -90
		// 				longitude : res.longitude, // 经度，浮点数，范围为180 ~ -180。
		// 				name : '我的位置', // 位置名
		// 				//address : '5pai8社区', // 地址详情说明
		// 				scale : 28, // 地图缩放级别,整形值,范围从1~28。默认为最大
		// 				//infoUrl : 'http://www.gongjuji.net' // 在查看位置界面底部显示的超链接,可点击跳转（测试好像不可用）
		// 			});

		// 		},
		// 		cancel: function (res) {
		// 			layer.open({
		// 				content: '您拒绝授权获取地理位置',
		// 				btn: '我知道了'
		// 			});

		// 		},
		// 		fail: function (res) {
		// 			// alert('fail'+JSON.stringify(res));
		// 			layer.open({
		// 				content: '未能获取地理位置，首先检查手机是否启用微信定位',
		// 				btn: '我知道了'
		// 			});
		// 		}
		// 	});
		// 	wx.error(function (res) {
		// 		layer.open({
		// 			content: 'error接口调取失败！请联系技术部' + JSON.stringify(
		// 				res),
		// 			btn: '我知道了'
		// 		});
		// 	});
		// });
	}
	</script>

</body>



</html>
